<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>登录-N站</title>
    <!-- 标题栏logo -->
    <link rel="icon" href="../../image/nLogo.jpg" type="image/x-icon">
    <!-- 收藏夹里显示的logo -->
    <link rel="shortcut icon" href="../../image/nLogo.jpg" type="image/x-icon">
    <!-- layui样式 -->
    <link href="../../layui/css/layui.css" rel="stylesheet">
    <script src="../../layui/layui.js"></script>
    <script src="../../js/jquery.min.js"></script>
</head>
<body style="background: #F0F0F0;">
<!--导航栏-->
<div class="layui-row layui-panel" style=" background: #222222;">
    <div class="layui-col-md2" style="padding: 10px; text-align: center;">
        <a href="../../index.html" style="color: white; font-weight: bolder; font-size: x-large;">N站</a>
    </div>
    <ul class="layui-nav layui-col-md8" lay-filter="" style="background: #222222;">
        <li class="layui-nav-item"><a href="../../index.html">首页</a></li>
        <li class="layui-nav-item"><a href="homeNews.html">发现</a></li>
        <li class="layui-nav-item"><a href="homePublisher.html">新闻方</a></li>
        <li class="layui-nav-item"><a href="homeNewsType.html">新闻专栏</a></li>
        <li class="layui-nav-item"><a href="homeSubscribe.html">我的订阅</a></li>
        <li class="layui-nav-item"><a href="">可能感兴趣</a></li>
    </ul>
    <div class="layui-nav layui-col-md2" style=" background: #222222; display: flex;align-items: center; padding: 10px;">
        <button class="layui-btn layui-btn-sm" lay-event="register">注册</button>
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="login">登录</button>
    </div>
</div>
<!--页面主体-->
<div class="layui-row" style="height: 90vh; display: flex; justify-content: center;">
    <div class="layui-col-md7" style="margin-top: 10px;">
        <div class="layui-panel"  style="padding: 10px; font-size: larger;">请登录</div>
        <form class="layui-panel layui-form"  style="padding: 10px;">
            <div class="layui-form-item">
                <label class="layui-form-label">手机号：</label>
                <div class="layui-input-inline">
                    <input type="text" name="userPhone" required lay-verify="required|phone" placeholder="请输入您的手机号" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">密码：</label>
                <div class="layui-input-inline">
                    <input type="password" name="userPwd" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-filter="add" lay-submit="">登录</button>
                    <button class="layui-btn layui-btn-primary">找回密码</button>
                </div>
            </div>
        </form>
    </div>
</div>
</body>
<script type="text/javascript">
    //注意：导航 依赖 element 模块，否则无法进行功能性操作
    layui.use(['util', 'layer','form','element'], function(){
        var element = layui.element
            ,util = layui.util
            ,form = layui.form;

        util.event('lay-event',{
            login : function (){
                window.location.href = "./userLogin.html";
            },
            register: function (){
                window.location.href = "userRegister.html";
            }
        });

        form.on('submit(add)',
            function (data){
                //在这里写登录的ajax请求
                return false;
            }
        );
    });
</script>
</html>